import React from 'react';
import { Row, Col, Form, Input, Button, Spin, Table, Select, Popconfirm } from 'antd';
import moment from 'moment';
import { getJsonReactNode } from '../../../utils';
import { DEFAULT_PAGE_SIZE } from '../../../utils/constants';
import styles from '../../common.css';

const FormItem = Form.Item;
const formItemLayout = {
  labelCol: {
    span: 7,
  },
  wrapperCol: {
    span: 17,
  },
};

@Form.create()
class SprintAnalysisDetailTable extends React.Component {
  constructor(props) {
    super(props);
    this.state = { // 状态树，存储各个控件的状态值，供外部调用
      currentRecord: {}, // 定义当前行变量，通过判断变量是否有值来决定走新增 or 修改
      modalVisible: false, // 定义是否显示新增/编辑弹窗页面
      selectedRowKeys: [],
    };
  }
  handleSearch = () => { // 查询方法
    const {  // 该组件的属性，由外部传入参数
      dispatch,
      form: { validateFields, getFieldsValue },
    } = this.props;
    validateFields((errors) => {
      if (errors) {
        return;
      }
      const data = {
        ...getFieldsValue(),
      };
      // console.log(data);
      dispatch({ // 调用接口，请求数据
        type: 'analysis/fetchSprintAnalysisDetail', //  models的namespace + effects的方法名，也可以是reducers的方法
        payload: {
          params: data,
        },
      });
    });
  };

  render() {
    const { dispatch, loading, sprintAnalysisDetail, form: { getFieldDecorator } } = this.props;
    const storyStatusEnum = [
      {
        id: 0,
        name: '插入需求',
      },
      {
        id: 1,
        name: '延期需求',
      },
    ];
    const planResultEnum = [
      {
        id: 0,
        name: '未完成',
      },
      {
        id: 1,
        name: '已完成',
      },
    ];
    // 定义表头字段及取值内容
    const columns = [
      {
        title: 'ID',
        dataIndex: 'id',
        key: 'id',
      },
      {
        title: '项目名称',
        dataIndex: 'project_name',
        key: 'project_name',
      },
      {
        title: 'jira描述',
        dataIndex: 'summary',
        key: 'summary',
      },
      {
        title: '指派给',
        dataIndex: 'assignee',
        key: 'assignee',
      },
      {
        title: '版本号',
        dataIndex: 'jira_fixversion',
        key: 'jira_fixversion',
      },
      {
        title: 'SprintID',
        dataIndex: 'sprintid',
        key: 'sprintid',
      },
      {
        title: 'Sprint名字',
        dataIndex: 'sprintName',
        key: 'sprintName',
      },
      {
        title: '变更类型',
        dataIndex: 'storystatus',
        key: 'storystatus',
        render: (text) => { // 对返回结果值进行判断，展示每种结果值对应的前端展示
          let res = '';
          switch (text) {
            case '0':
              res = '插入需求';
              break;
            case '1':
              res = '延期需求';
              break;
            case '2':
              res = '正常需求';
              break;
            default:
              res = text;
          }
          return res;
        },
      },
      {
        title: '任务是否完成',
        dataIndex: 'plan_result',
        key: 'plan_result',
        render: (text) => { // 对返回结果值进行判断，展示每种结果值对应的前端展示
          let res = '';
          switch (text) {
            case '0':
              res = '未完成';
              break;
            case '1':
              res = '已完成';
              break;
            default:
              res = text;
          }
          return res;
        },
      },
      {
        title: 'jira状态',
        dataIndex: 'jira_status',
        key: 'jira_status',
      },
      {
        title: '创建时间',
        dataIndex: 'createdtime',
        key: 'createdtime',
        render: (text) => {
          return moment(text).format('YYYY-MM-DD HH:mm:ss');
        },
      },
    ];
    // const modalProps = {
    //   dispatch,
    //   loading,
    //   visible: this.state.modalVisible,
    //   currentUser: this.state.currentRecord,
    //   onCancel: () => {
    //     this.setState({
    //       currentRecord: {},
    //       modalVisible: false,
    //     });
    //   },
    // };
    return (
      <div>
        <Form>
          <Row gutter={12}>
            <Col span={5}>
              <FormItem
                label="SprintID"
                {...formItemLayout}
              >
                {getFieldDecorator('sprintid', {
                  initialValue: '',
                })(<Input />)}
              </FormItem>
            </Col>
            <Col span={5}>
              <FormItem
                label="项目名称"
                {...formItemLayout}
              >
                {getFieldDecorator('project_name', {
                  initialValue: '',
                })(<Input />)}
              </FormItem>
            </Col>
            <Col span={5}>
              <FormItem
                label="需求状态"
                {...formItemLayout}
              >
                {getFieldDecorator('storystatus', {
                  initialValue: '',
                })(
                  <Select>
                    <Select.Option key={-1} value="">请选择需求状态</Select.Option>
                    {
                      storyStatusEnum.map((item, index) => {
                        return (
                          <Select.Option key={index} value={item.id}>{item.name}</Select.Option>
                        );
                      })
                    }
                  </Select>
                )}
              </FormItem>
            </Col>
            <Col span={5}>
              <FormItem
                label="任务完成状态"
                {...formItemLayout}
              >
                {getFieldDecorator('plan_result', {
                  initialValue: '',
                })(
                  <Select>
                    <Select.Option key={-1} value="">请选择任务状态</Select.Option>
                    {
                      planResultEnum.map((item, index) => {
                        return (
                          <Select.Option key={index} value={item.id}>{item.name}</Select.Option>
                        );
                      })
                    }
                  </Select>
                )}
              </FormItem>
            </Col>
            <Col>
              <Button
                type="primary"
                loading={loading}
                onClick={this.handleSearch}
              >
                查询
              </Button>
            </Col>
          </Row>
          <Table
            columns={columns}
            dataSource={sprintAnalysisDetail}
            loading={loading}
            rowKey={record => record.id}
            pagination={{
              pageSize: DEFAULT_PAGE_SIZE,
            }}
            bordered
          />
        </Form>
      </div>
    );
  }
}

export default SprintAnalysisDetailTable;
